<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>实验教学管理系统</title>
	<link href="css/bootstrap.min.css" rel="stylesheet" />
	<script src="js/jquery-3.2.0.min.js" ></script>
	<script src="js/bootstrap.min.js" ></script>
	<script src="js/config.js" ></script>
	<script src="js/common.js" ></script>
</head>
<body style="padding:100px;">
	<div class="panel panel-primary">
		<div class="panel-heading" id="tableTitle"></div>
		
		<table class="table">
			<thead>
				<tr id="tableHead">
				</tr>
			</thead>
			<tbody id="tableBody">
			
			</tbody>
		</table>
	</div>
	<script>
		var $tableTitle = $('#tableTitle');
		var $tableHead = $('#tableHead');
		var $tableBody = $('#tableBody');
		var action = getUrlParam('action');
		if(action == 'SuperAdmin_classStudent.action'){
			window.location.href = 'classStudent.html';
		}
		if(action == 'scheduleSelect.action'){
			window.location.href = 'schedule.html';
		}
		var controller = action.split('_')[0];
		var act,idKey;
		var specialJson = {};
		
		var initTableTitle = function(title){
			$tableTitle.html(title);
			$tableTitle.append('<button id="add" type="button" class="btn btn-success" style="float:right">添加</button>');
		}
		
		var selectTagStr = function(name,data){
			var str = '<select name="'+name+'">';
			for(x in data){
				str += '<option value="'+data[x]['id']+'">'+data[x]['name']+'</option>'
			}
			str += '</select>';
			return $(str);
		}
		
		var inputTag = function(name){
			return $('<input type="text" class="form-control" name="'+name+'" placeholder="'+name+'" aria-describedby="basic-addon1">');
		}
		
		var getSelect = function(name,action){
			var $tag;
			$.ajax({  
          		type : "get",  
          		url : BASE_URL + "/" + action,  
          		async : false, 
       	  		dataType : 'json',
          		success : function(res){  
          			$tag = selectTagStr(name,res.data);
          		}  
		    });
			return $tag;
		}
		
		var getSpecial = function(spe,x){
			var $tag;
			switch(spe){
			case "hidden":
				$tag = $('<input type="hidden" class="form-control" name="'+x+'" placeholder="'+x+'" aria-describedby="basic-addon1">');
				break;
			case "disabled":
				$tag = $('<input type="text" class="form-control" name="'+x+'" placeholder="'+x+'" disabled="disabled" aria-describedby="basic-addon1">');
				break;
			case 'text':$tag = inputTag(x);break;
			case 'readonly':$tag = $('<input type="text" class="form-control" name="'+x+'" placeholder="'+x+'" readonly="readonly" aria-describedby="basic-addon1">');break;
			default :$tag = getSelect(x,spe);break;
			}
			return $tag;
		}
		
		var initSpecialTag = function(special,head){
			for(x in head){
				if(special[x]){
					specialJson[x] = getSpecial(special[x],x);
				}else{
					specialJson[x] = inputTag(x);
				}
				
			}
		}
		
		var initTableHead = function(thead){
			var input = '';
			for(x in thead){
				$tableHead.append('<th>'+thead[x]+'</th>');
			}
			$tableHead.append('<th>更新</th>');
			$tableHead.append('<th>删除</th>');
		}
		
		var initTableBodyTdData = function(data,special,x){
			//console.log(data,special,x);
			switch(special[x]){
			case 'hidden':
			case 'disabled':
			case 'readonly':
			case 'text':return specialJson[x].clone().val(data);break;
			default :
				var $select = specialJson[x].clone();
				$select.find('option[value='+data+']').attr('selected','selected');
				return $select;
			}
		}
		
		var initTableBody = function(tableData,special,thead){
			for(i in tableData){
				var $trTag = $('<tr></tr>');
				for(x in thead){
					var $tdTag =$('<td></td>');
					$tdTag.append(initTableBodyTdData(tableData[i][x],special,x));
					$trTag.append($tdTag);
				}
				$trTag.append('<td><button type="button" class="btn btn-primary wq_update">更新</button></td>');
				$trTag.append('<td><button type="button" class="btn btn-danger wq_delete">删除</button></td>');
				$tableBody.append($trTag);
			}
		}
		var mkData = function($tr){
			var data = {};
			$tr.find('input').each(function(){
				var $now = $(this);
				data[$now[0].name] = $now.val();	
			});
			$tr.find('select').each(function(){
				var $now = $(this);
				data[$now[0].name] = $now.val();
			});
			return data;
		}
		var initFunc = function(){
			$('#add').on('click',function(){
				var $tr = $('<tr></tr>');
				console.log('idKey ',idKey);
				for(x in specialJson){
					var $td = $('<td></td>');
					if(!specialJson[x].attr('disabled') && x!=idKey){
						var $t = specialJson[x].clone().removeAttr('readonly');
						if($t.attr('type') == 'hidden'){
							$t.attr('type','text');
						}
						console.log($t);
						$td.append($t);
					}
					$tr.append($td);
				}
				var $btn = $('<button type="button" class="btn btn-primary .wq_insert">插入</button>');
				$btn.on('click',function(){
					var $tr = $(this.parentElement.parentElement);
					var data = mkData($tr);
					data[MAP_TABLE] = act;
					$.post(BASE_URL + "/" + controller + "_insert",data,function(res){
						console.log(res);
						alert(res.msg);
						location.reload();
					},'json')
				});
				var $td = $('<td></td>');
				$td.append($btn);
				$tr.append($td);
				$tr.append('<td></td>');
				$tableBody.append($tr);
			});
			$('.wq_update').on('click',function(){
				var $tr = $(this.parentElement.parentElement);
				var data = mkData($tr);
				data[MAP_IDKEY] = idKey;
				data[MAP_TABLE] = act;
				$.post(BASE_URL + "/" + controller + "_update",data,function(res){
					console.log(res);
					alert(res.msg);
					location.reload();
				},'json');		
				
			});
			$('.wq_delete').on('click',function(){
				var id = $(this.parentElement.parentElement).find('input[name='+idKey+']').val();
				var data = {};
				data[MAP_IDKEY] = idKey;
				data[MAP_TABLE] = act;
				data[idKey] = id;
				console.log(data);
				$.post(BASE_URL + "/" + controller + "_delete",data,function(res){
					console.log(res);
					alert(res.msg);
					location.reload();
				},'json');
			});
		}
		
		var initTable = function(data){
			console.log(1);
			initTableTitle(data.tableController.title);
			console.log(2);
			initSpecialTag(data.tableController.special,data.tableController.thead);
			console.log(specialJson);
			initTableHead(data.tableController.thead);
			initTableBody(data.tableData,data.tableController.special,data.tableController.thead);
			initFunc();
		}
		$.get(BASE_URL + "/" + action,{},function(res){
			var data = isSuc(res);
			if(data){
				console.log(data);
				act = data.action;
				idKey = data.idKey;
				initTable(data);	
			}else{
				//alert(res.msg);
			}
			
		},'json');
	</script>
</body>
</html>